<template>
	<!-- 产品中心 -->
	<view>
		<u-sticky>
			<view class="header px-2 py-1 bg-white" v-if="exhibitionId">
				<view><search-view @search="searchChange" @clear="searchChange"></search-view></view>
			</view>
			<view><tab :tab-list="tabs" @tabAll="tabAll" @contTabChange="tabChange" :count-num="countNum"></tab></view>
			<view style="margin-top: -10rpx;" class="mb-1" v-if="catId == 41">
				<u-gap height="7" bgColor="#F9F9F9"></u-gap>
				<view class="bg-white p-2 flex">
					<view v-for="(item, index) of powerTabs" :key="index" class="font-small mr-3" :class="{ power_active: powerCur == index }" @click="powerChange(item, index)">
						{{ item }}
					</view>
				</view>
			</view>
		</u-sticky>
		<view v-if="list.length == 0">
			<view class="p-2 mt-3"><u-empty mode="data" icon="http://cdn.uviewui.com/uview/empty/data.png"></u-empty></view>
		</view>
		<view v-else class="px-2 mt-3">
			<product-list :list="list" :btn-show="true" :exhibition-id="exhibitionId" class="flex flex-wrap justify-between"></product-list>
			<u-loadmore :status="status" color="#E5E5E5" lineColor="#E5E5E5" dashed line />
		</view>
	</view>
</template>

<script>
import { getFormSign, exhibitionCondition } from '@/api/home/company.js';
import { getProductList, productListData } from '@/api/home/nav/product_data.js';
import productList from '@/components/product_list/product_list.vue';
import tab from '@/components/tab/index.vue';
import searchView from '@/components/search/search.vue';
export default {
	props: ['downPro', 'downExhibitionId', 'downUid'], // 产品下载列表里的推荐产品
	components: {
		tab,
		productList,
		searchView
	},
	data() {
		return {
			tabs: [],
			powerTabs: [],
			companyId: '', //企业id
			list: [],
			countNum: [],
			status: 'loadmore',
			page: 1, //页数
			suo: true,
			exhibitionId: '', //展会id
			catId: '',
			powerCur: 0,
			power: '',
			searchVal: '',
			shareId: '' //后台记录是否为扫描二维码进入当前页面
		};
	},
	onLoad(option) {
		this.companyId = option.companyId;
		this.shareId = option.share_id;
		if (option.exhibitionId) {
			this.exhibitionId = option.exhibitionId;
			uni.setNavigationBarTitle({
				title: '参展产品库'
			});
		} else {
			uni.setNavigationBarTitle({
				title: '产品中心'
			});
		}
		this.reset();
		this.productSelect();
		this.getPower();
		this.productList('');
		// 分享
		wx.showShareMenu({
			withShareTicket: true,
			menus: ['shareAppMessage', 'shareTimeline']
		});
	},
	created() {
		// 产品下载页面推荐产品
		if (this.downPro) {
			// console.log('展会id', this.exhibitionId);
			this.exhibitionId = this.downExhibitionId;
			this.reset();
			this.productSelect();
			this.getPower();
			this.productList('');
		}
	},
	mounted() {
		if (this.downPro) {
			let that = this;
			uni.$on('onReachBottomDownload', data => {
				console.log('上拉加载');
				if (this.suo) {
					//定义个小锁，当没有数据时锁住suo
					this.status = 'loading';
					this.page = ++this.page;
					setTimeout(() => {
						this.productList('');
					}, 1000);
				}
			});
		}
	},
	onReachBottom() {
		if (this.suo) {
			//定义个小锁，当没有数据时锁住suo
			this.status = 'loading';
			this.page = ++this.page;
			setTimeout(() => {
				if (this.catId) {
					this.productList(this.catId);
				} else {
					this.productList('');
				}
			}, 1000);
		}
	},
	methods: {
		searchChange(val) {
			// console.log("搜索",val);
			this.searchVal = val || '';
			this.reset();
			this.productList('');
		},
		// 获取企业产品分类
		productSelect() {
			getFormSign().then(res => {
				if (res.code == 0) {
					this.tabs = res.data;
				} else {
					uni.$u.toast('获取产品分类失败');
				}
			});
		},
		// 获取功率筛选条件
		getPower() {
			exhibitionCondition().then(res => {
				if (res.code == 0) {
					this.powerTabs = ['全部', ...res.data.list];
				} else {
					console.log('获取功率筛选条件失败');
				}
			});
		},
		reset() {
			this.list = [];
			this.page = 1;
		},
		// tab-全部
		tabAll() {
			this.catId = '';
			this.reset();
			this.productList('');
		},
		tabChange(e) {
			this.catId = e.val.id;
			this.reset();
			this.productList(e.val.id);
		},
		powerChange(val, idx) {
			this.powerCur = idx;
			this.power = val == '全部' ? '' : val;
			this.reset();
			this.productList(this.catId);
		},
		productList(val) {
			let testType = 0;
			if (this.downPro) {
				testType = 3;
			} else if (this.exhibitionId) {
				testType = 1;
			} else {
				testType = 2;
			}
			let msg = {
				kw: this.searchVal || '',
				page: this.page,
				mid: val,
				uid: this.downPro ? this.downUid : this.companyId,
				token: uni.getStorageSync('userInfo').token || '',
				search: this.power,
				zhanhui_id: this.exhibitionId,
				// uid: this.downPro ? this.downUid : uni.getStorageSync('userInfo').userId,
				type: testType, //"type":  1 ： 展会产品列表   2 ： 大产品库    3：  产品下载页面的公司推荐产品
				share_id: this.shareId
			};

			productListData(msg).then(res => {
				if (res.code == 0) {
					this.countNum = testType == 3 ? res.data.count : [];
					this.list.push(...res.data.list);
					if (res.data.list.length == 0) {
						this.status = 'nomore';
						this.suo = false;
					} else if (res.data.list.length < 10) {
						this.status = 'nomore';
						this.suo = false;
					} else {
						this.status = 'loadmore';
						this.suo = true;
					}
				} else {
					uni.$u.toast(res.msg);
				}
			});

			// if (this.downPro) {
			// 	let downMsg = {
			// 		kw: this.searchVal || '',
			// 		page: this.page,
			// 		mid: val,
			// 		uid: this.downUid, //当前产品的用户id
			// 		search: this.power,
			// 		zhanhui_id: this.exhibitionId
			// 	};
			// 	recommendList(downMsg).then(res => {
			// 		if (res.code == 0) {
			// 			this.countNum = res.data.count;
			// 			this.list.push(...res.data.list);
			// 			if (res.data.list.length == 0) {
			// 				this.status = 'nomore';
			// 				this.suo = false;
			// 			} else if (res.data.list.length < 10) {
			// 				this.status = 'nomore';
			// 				this.suo = false;
			// 			} else {
			// 				this.status = 'loadmore';
			// 				this.suo = true;
			// 			}
			// 		} else {
			// 			uni.$u.toast(res.msg);
			// 		}
			// 	});
			// 	return;
			// }
			// let msg = {
			// 	kw: this.searchVal || '',
			// 	page: this.page,
			// 	mid: val,
			// 	uid: this.companyId,
			// 	token: uni.getStorageSync('userInfo').token || '',
			// 	search: this.power
			// };
			// if (this.exhibitionId) {
			// 	// 展会-产品中心
			// 	msg = {
			// 		...msg,
			// 		uid: uni.getStorageSync('userInfo').userId || '',
			// 		zhanhui_id: this.exhibitionId
			// 	};
			// 	exhibitionProduct(msg).then(res => {
			// 		if (res.code == 0) {
			// 			this.countNum = res.data.count;
			// 			this.list.push(...res.data.list);
			// 			if (res.data.list.length == 0) {
			// 				this.status = 'nomore';
			// 				this.suo = false;
			// 			} else if (res.data.list.length < 10) {
			// 				this.status = 'nomore';
			// 				this.suo = false;
			// 			} else {
			// 				this.status = 'loadmore';
			// 				this.suo = true;
			// 			}
			// 		} else {
			// 			uni.$u.toast(res.msg);
			// 		}
			// 	});
			// } else {
			// 	// 全部产品列表
			// 	getProductList(msg).then(res => {
			// 		if (res.code == 0) {
			// 			this.list.push(...res.data.list);
			// 			if (res.data.list.length == 0) {
			// 				this.status = 'nomore';
			// 				this.suo = false;
			// 			} else if (res.data.list.length < 10) {
			// 				this.status = 'nomore';
			// 				this.suo = false;
			// 			} else {
			// 				this.status = 'loadmore';
			// 				this.suo = true;
			// 			}
			// 		} else {
			// 			uni.$u.toast(res.msg);
			// 		}
			// 	});
			// }
		}
	}
};
</script>

<style lang="scss" scoped>
.header {
	width: 100%;
	// height: 92rpx;
	// background: $color14;

	.filter_btn {
		width: 142rpx;
		height: 56rpx;
		border: 1px solid #d2d2d2;
		border-radius: 28rpx;
		font-size: 20rpx;
		line-height: 56rpx;

		image {
			width: 25rpx;
			height: 25rpx;
			margin-right: 5rpx;
		}
	}
}

.power_active {
	color: $color14;
	font-size: 24rpx;
	font-weight: bold;
}
</style>
